<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=7">
<title>dupstr 0.1 - ${filename}</title>
<script>
var originalText = "${originalText}";
var offsets = ${offsets};
var prevItem;

function insertStr(text, pos, insertedText) {
   var before = text.substring(0, pos);
   var after = text.substring(pos, text.length);
   return before + insertedText + after;
}

function displayDupStr(selectedIndex) {
   // add span tags to the original text
   var newtext = originalText;
   var ranges = offsets[selectedIndex];
   var offset = 0;
   var begintag = '<span class="dupstr">';
   var endtag = '</span>';
   for(var index = 0; index < ranges.length; ++index) {
      // insert begin tag
      newtext = insertStr(newtext, ranges[index][0] + offset, begintag);
      offset += begintag.length;
      newtext = insertStr(newtext, ranges[index][1] + offset + 1, endtag);
      offset += endtag.length;
   }
      
   // finally update the display
   if(prevItem) {
      document.getElementById(prevItem).style.backgroundColor = '';
   }
   document.getElementById(prevItem = ('item' + selectedIndex)).style.backgroundColor = 'GreenYellow';
   document.getElementById("originalText").innerHTML = newtext;   
}
</script>
<style>
body { font-family: tahoma; font-size: small }
A:link {text-decoration: none}
A:visited {text-decoration: none}
A:hover {color: red}
span.dupstr { color:red }
</style>
</head>
<body>
<h1>Duplicate strings found in ${filename}</h1>

<table>
   <tr>
      <td style="width:30%; vertical-align:top" >
         <h3>Duplicate Strings</h3> 
         <div style="max-height: 35em; overflow:scroll;">
	         <% dupstrs.eachWithIndex { it, index -> %>
	            <div id="item${index}" style="padding:5px" > 
	              <a href="javascript:displayDupStr(${index})">${it}</a>
	            </div>
	         <% } %>
         </div>
      </td>
      <td style="width:70%; vertical-align:top" >
         <h3>Original Text</h3> 
         <div id="originalText" style="max-height:35em; overflow:scroll; max-width:60em">${originalText}</div>
      </td>
   </tr>
</table>

</body>
</html>